<template>
    <div class="tab1"> 
        <div class="perfood">
            <div v-for="(v,i) in proarr" :key="i" @click="xiangqing(v.courseId)">
                <img :src="v.coverImage" alt=""/>
                <p>{{v.coverTitle}}</p>
                <p>{{v.courseId}}</p>
            </div> 
        </div>
    </div>
</template>
<script>
export default {
    props:{
        proarr:Array
    },
    data() {
        return {
            courseId:0
        }
    },
    methods: {
        xiangqing(e){
            //window.console.log(e)
            this.courseId=e
            //window.console.log(this.courseId)
             this.$router.push({
                path: '/xiangqing',
                query: {
                    courseId:this.courseId
                }
        })
        }
    },
}
</script>
<style scoped>
.tab1{width:100%;}
.perfood{display: flex;width: 100%;flex-wrap: wrap;justify-content: space-between}
.perfood div{width:47%;margin:.08rem 0}
.perfood img{width:1.50rem}
.perfood p{width:100%; overflow: hidden; white-space: nowrap;
color: #666;text-overflow: ellipsis} 
</style>